<template>
  <div>
    <a-form-model-item v-if="showAppListSelect" label="执行器名称" prop="appName"
                       :rules="[{ required: true, message: '执行器名称必填' }]">
      <a-select v-model.trim="newValue.appName">
        <a-select-option v-for="(item) in appNameList" :value="item.appname" :key="item.appname">
          {{ item.appname }}
        </a-select-option>
      </a-select>
    </a-form-model-item>
    <a-form-model-item label="任务名称" prop="jobName" :rules="[{ required: true, message: '任务名称必填' }]">
      <a-input :maxLength="120" v-model.trim="newValue.jobName" placeholder="请输入" />
    </a-form-model-item>
    <a-form-model-item label="任务描述" prop="jobDesc">
      <a-textarea :maxLength="120" v-model="newValue.jobDesc" placeholder="请输入" :auto-size="{ minRows: 3, maxRows: 5 }" />
    </a-form-model-item>
    <a-form-model-item label="是否启用" prop="taskStatus">
      <a-switch v-model="newValue.taskStatus" checked-children="是" un-checked-children="否" />
    </a-form-model-item>
  </div>
</template>

<script>
import _isEqual from 'lodash/isEqual'
export default {
  name: 'TaskBasic',
  props: {
    value: {
      type: Object,
      default: () => ({})
    },
    showAppListSelect: {
      type: Boolean,
      default: true
    },
    appNameList: {
      type: Array,
      default: () => ([])
    }
  },
  data() {
   return {
    forms: this.form,
     newValue: {
     }
   }
  },
  watch: {
    // form: {
    //   handler (value, oldValue) {
    //     this.forms = value
    //   },
    //   immediate: true,
    //   deep: true
    // },
    value: {
      handler (value, oldValue) {
        if (!_isEqual(value, oldValue)) {
          this.newValue = value
        }
      },
      immediate: true,
      deep: true
    },
    newValue: {
      handler (value, oldValue) {
        this.$emit('input', value)
      },
      immediate: true,
      deep: true
    }
  }
}
</script>

<style scoped>

</style>
